<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
    <meta name="renderer" content="webkit">
    <meta content="歪秀购物, 购物, 大家电, 手机" name="keywords">
    <meta content="歪秀购物，购物商城。" name="description">
    <title>我的评价</title>
    <link rel="shortcut icon" type="image/x-icon" th:href="@{/myFile/imgold/icon/favicon.ico}">
    <link rel="stylesheet" type="text/css" th:href="@{/theme/css/base.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/theme/css/member.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/layui/css/layui.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/theme/css/home.css}">
    <script type="text/javascript" th:src="@{/theme/js/jquery.js}"></script>
    <script type="text/javascript" th:src="@{/layui/layui.js}"></script>
    <script type="text/javascript" th:src="@{/theme/js/delCartOnPages.js}"></script>
    <script type="text/javascript" th:src="@{/theme/js/searchToPage.js}"></script>
</head>
<script>



</script>
<script>
    var evaScore = 5;
    var anonymous = 0;
    var readOnly = false;
    var fileName="";
    var serEvaScore = [[${evaScore}]];
    if ('l' == '[[${type}]]') {
        readOnly = true;
        if(serEvaScore>=0)
            evaScore = serEvaScore;
    }
    layui.use('upload', function () {
        var load = null;
        var $ = layui.jquery
            , upload = layui.upload;
        var files;
        var orderId = [[${orderId}]];
        var specificationId = [[${specificationId}]];
        //执行实例
        var uploadInst = upload.render({
            elem: '#pic' //绑定元素
            , url: '/file/upploadEvaPic'
            , data: {
                "orderId":orderId,
                "specificationId":specificationId
            }
            , accept: 'images'
            , acceptMime: 'image/*' /* 打开文件选择器时 只显示图片*/
            // ,exts: //允许的后缀
            , auto: true /* 是否选完图片自动上传*/
            // , bindAction: 'btn_commit'
            , multiple: true /* 是否允许多文件上传 true是 false否*/
            // , number: 2 /* 设置能上传几个文件*/
            , headers: {token: 'sasasas'}
            , drag: true //拖拽上传

            , size: 1024 * 5 /* 设置上传单一文件最大尺寸*/


            , choose: function (obj) {  //选择图片后事件
                //将每次选择的文件追加到文件队列
                files = obj.pushFile();

                //预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)
                obj.preview(function (index, file, result) {
                    // console.log(index); //得到文件索引
                    // console.log(file); //得到文件对象
                    // console.log(result); //得到文件base64编码，比如图片
                    $('#pic').html('<img style=\'width: 258px;height: 135px;\' src="' + result + '" alt="' + file.name + '" class="layui-upload-img">');

                    //obj.resetFile(index, file, '123.jpg'); //重命名文件名，layui 2.3.0 开始新增

                    //这里还可以做一些 append 文件列表 DOM 的操作

                    //obj.upload(index, file); //对上传失败的单个文件重新上传，一般在某个事件中使用
                    //delete files[index]; //删除列表中对应的文件，一般在某个事件中使用
                });
            }
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致

                load = layer.load(); //上传loading
                // console.log(obj);
            }

            , done: function (res) {
                layer.close(load);

                if (res.result == 'ok') {
                    //do something （比如将res返回的图片链接保存到表单的隐藏域）
                    files = null;
                    layer.msg('上传成功', {time: 1000}, function () {
                        fileName+=res.fileName+",";
                    });
                } else if (res.result == 'fail') {
                    layer.msg('数据库更新失败，请重试！', {time: 1000}, function () {
                    });
                } else if (res.result == 'saveFail') {
                    layer.msg('文件储存失败，请重试！', {time: 1000}, function () {
                    });
                } else if (res.result == 'noSession') {
                    layer.msg('登录失效，请重新登录！', {time: 1000}, function () {
                        window.location = "login?toPage=myIdcard";
                    });
                }

                //获取当前触发上传的元素，一般用于 elem 绑定 class 的情况，注意：此乃 layui 2.1.0 新增
                var item = this.item;

                //文件保存失败
                //do something
            }
            , error: function () {
                layer.msg('上传失败，请重试', {time: 1000}, function () {
                });
                //请求异常回调
                //当上传失败时，你可以生成一个“重新上传”的按钮，点击该按钮时，执行 upload() 方法即可实现重新上传
            }
        });
    });

    layui.use('form', function () {
        var form = layui.form;

        //监听提交
        form.on('submit(formDemo)', function (data) {
            // layer.msg(JSON.stringify(data.field));
            return false;
        });

        form.on('switch(switchTest)', function (data) {
            if (this.checked) {
                anonymous = 1;
            } else {
                anonymous = 0;
            }
            //开关的是switch，普通的多选框是checkbox；
            //括号内是lay-filter，每一个checbox中都要有，如爱好多选框，写作、阅读、游戏的input标签中都要添加lay-filter=‘aihao’ 然后checkbox(aihao)就是监听的爱好选择
            //值：this.checked = 'true' or 'false'
        });
    });


    layui.use(['element', 'layer'], function () {
        var element = layui.element;
        var layer = layui.layer;
    });
    if(readOnly==true){
        layui.use(['rate'], function () {
            var rate = layui.rate;
            rate.render({
                elem: '#test4'
                , value: evaScore
                , text: true
                , theme: '#FE0000'
                , readonly: true
                //自定义文本，点击后文本显示的内容
                , setText: function (value) {
                    // console.log(value);
                }
                //选定时调用，评分时发送一个ajax,readonly设为true
                , choose: function (value) {
                    evaScore = value;
                }
            })
        });
    }else if(readOnly==false){
        layui.use(['rate'], function () {
            var rate = layui.rate;
            rate.render({
                elem: '#test4'
                , value: evaScore
                , text: true
                , theme: '#FE0000'
                , readonly: false
                //自定义文本，点击后文本显示的内容
                , setText: function (value) {
                    // console.log(value);
                }
                //选定时调用，评分时发送一个ajax,readonly设为true
                , choose: function (value) {
                    evaScore = value;
                }
            })
        });
    }


    function commit() {
        var describe = $("#describe").val();
        var orderId = [[${orderId}]];
        var specificationId = [[${specificationId}]];
        fileName=fileName.substring(0, fileName.length - 1);
        $.ajax({

            url: "/evaluate/addEvaluate",
            dataType: "json",
            data: {
                "evaScore": evaScore,
                "describe": describe,
                "anonymous": anonymous,
                "orderId": orderId,
                "specificationId": specificationId,
                "fileName":fileName
            },
            async: false,
            success: function (data) {
                if (data["result"] == "ok") {
                    layer.msg('评论成功', {time: 1000}, function () {
                        window.location.reload();
                    });
                } else if (data["result"] == "fail") {
                    layer.msg('评论失败', {time: 1000}, function () {
                        window.parent.location.reload();
                    });
                }else if (data["result"] == "had") {
                    layer.msg('已经评论过', {time: 1000}, function () {
                        window.parent.location.reload();
                    });
                } else if (data["result"] == "noSession") {
                    layer.msg('登录失效，请重新登录', {time: 1000}, function () {
                        window.parent.location = "login";
                    });
                } else {
                    layer.msg('系统错误', {time: 1000}, function () {
                        window.parent.location.reload();
                    });
                }
            },
            type: "post"
        });
    }


</script>
<body style="overflow-x:hidden;">
<form class="layui-form" action=""style="width:35%">

    <div class="layui-form-item">
        <label class="layui-form-label"><i class="reds">*</i>评&nbsp&nbsp&nbsp分：</label>
        <div style="margin-left: 0px" class="layui-input-block" id="test4">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-form-label"><i class="reds">*</i>商品评价：</div>
        <div class="layui-input-block">
            <textarea name="desc" th:if="${type}=='w'" id="describe" placeholder="请输入商品评价"
                      class="layui-textarea"></textarea>
            <textarea name="desc" th:if="${type}=='l'" th:text="${evaluateUserSpeCom.content}" placeholder="评价内容为空"
                      class="layui-textarea"></textarea>
        </div>
    </div>

    <div class="layui-form-item" th:if="${type}=='w'">
        <div class="layui-form-label">晒&nbsp&nbsp&nbsp单：</div>
        <div class="layui-input-block">
            <div class="layui-form-item">
                <div class="layui-upload-drag" id="pic">
                    <div id="userHead"><i class="layui-icon"></i></div>
                    <p>点击或拖拽上传图片</p>
                </div>
                <input class="layui-upload-file" type="file" accept="image/*" name="file">
            </div>
        </div>
    </div>
    <div class="layui-form-item" th:if="${type}=='w'">
        <label class="layui-form-label">匿名评价</label>
        <div class="layui-input-block">
            <input type="checkbox" name="switch" lay-skin="switch" lay-text="ON|OFF" lay-filter="switchTest" value="1"><div class="layui-unselect layui-form-switch" lay-skin="_switch"><em>OFF</em><i></i></div>
        </div>
    </div>
    <div class="layui-form-item" th:if="${type}=='l'">
        <div class="layui-form-label" style="float: right">
            <span th:if="${evaluateUserSpeCom.anonymous}==1" style="color: #1E9FFF;"> 匿名评价</span>
            <span th:if="${evaluateUserSpeCom.anonymous}==0" style="color: #1E9FFF;"> 实名评价</span>
        </div>

    </div>
    <div class="layui-form-item" th:if="${type}=='l'">
        <div class="layui-form-label"style="float:left">晒&nbsp&nbsp&nbsp单：</div>
        <div style="float:right;width:300px">
            <span th:each="evaPic: ${evaluateUserSpeCom.evaluatePics}">
                <img th:src="'/myFile/img/evaluatePic/'+${evaPic.picture}+''" style="float:left; width:80px;height:80px;margin-right:20px">
            </span>

        </div>
    </div>
    <div class="layui-form-item" th:if="${type}=='w'">
        <div class="layui-input-block">
            <button class="layui-btn" type="button" onclick="commit()">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>


</body>
</html>